<template>
  <div id="main">
  </div>
</template>

<script>
import E from "wangeditor"
export default {
    name:'WangEditor',
    data() {
      return {
        editor:''
      }
    },
    mounted(){
        this.editor = new E("#main")
        this.editor.create()
        // 自动取消 focus
        this.editor.config.focus = false
        // 更改层级
        // this.editor.config.zIndex = 99
        // this.editor.config.zIndexFullScreen = 100
        document.getElementById('main').children[0].style.zIndex = 99
        document.getElementById('main').children[1].style.zIndex = 101
        // console.log(document.getElementById('main').children,document.getElementById('main').children[0].style.zIndex)
        // 配置回调函数 --- 获取输入的值内容
        this.editor.config.onchange =(newHtml)=>{
            // 当编辑器选区、内容变化时，即触发
            // console.log('content', editor.children)
            // console.log('html', newHtml)
            let html = newHtml.slice(3).slice(0,-4)
            // console.log("1111",html)
            // 把富文本编辑的内容--传递出去给(父组件)
            this.$emit('sendEditor',html)
        }
        this.editor.config.onchangeTimeout = 500
        // console.log("777",this.editor.config)
    }, 
}
</script>

<style>

</style>